<div class="modal fade" id="add" role="dialog" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content">
            <form #addForm="ngForm" (ngSubmit)="add(addForm.value)">
            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">主题词表 — 新增</h4>
                <button type="button" class="close" data-dismiss="modal" (click)="_showAddChildInfo()">&times;</button>
            </div>
            <!-- 模态框主体 -->
            <div class="modal-body">
                <div class="container">
                    <div class="input_div" style="display:none">
                        <label class="input_title">上层主题词表：</label>

                        <select *ngIf="_checkNullObj(details)" class="input_inputStyle" name="parentId" #parentId="ngModel" [ngModel]="details.themeTableId">
                            <option value=""></option>
                            <option value="{{ val.themeTableId }}" *ngFor="let val of parentList">{{ val.name }}</option>
                        </select>

                        <select *ngIf="!_checkNullObj(details)" class="input_inputStyle" name="parentId" #parentId="ngModel" ngModel>
                            <option value=""></option>
                            <option value="{{ val.themeTableId }}" *ngFor="let val of parentList">{{ val.name }}</option>
                        </select>

                        <!-- <select class="input_inputStyle" *ngIf="details" [disabled]="details" name="parentId" #parentId="ngModel" ngModel>
                            <option value=""></option>
                            <option value="{{ details.themeTableId }}">{{ details.name }}</option>
                        </select> -->
                        <span class="keyword_error" *ngIf="!details">(为空则为一级层级)</span>
                        
                    </div>
                    <div class="input_div">
                        <label class="input_title">主题词表名称：</label>
                        <input type="text" name="wordName" class="input_inputStyle" placeholder="输入主题词表名称" forbiddenName="bob"
                               minlength="1" maxlength="20" #name="ngModel" ngModel required />
                    </div>

                    <div class="input_div">
                        <label class="input_title">选择标签：</label>
                        <select class="input_inputStyle" name="labelId" #labelId="ngModel" ngModel="-1">
                            <option value=""></option>
                            <option *ngFor="let val of themeTableTagListVal" value="{{ val.labelId }}">{{ val.labelName }}</option>
                        </select>
                    </div>

                    <div class="input_div">
                        <label class="input_title">主题词表编号：</label>
                        <!-- autocomplete="off" pattern="^[a-zA-Z_]+$" -->
                        <input type="text" name="themeTableCode" class="input_inputStyle" placeholder="输入主题词表编号"
                             #themeTableCode="ngModel" ngModel required />
                        <span class="keyword_error" *ngIf="themeTableCode.invalid && (themeTableCode.touched) && themeTableCode.errors.pattern">主题词表编号不能为汉字,特殊符号，允许输入_</span>
                    </div>

                    <div class="input_div">
                        <label class="input_title">是否启用：</label>
                        <select class="input_inputStyle" name="status" #status="ngModel" ngModel="0">
                            <option value="0">启用</option>
                            <option value="-1">禁用</option>
                        </select>
                    </div>

                    <!--<div class="input_div">-->
                        <!--<label class="input_title">是否审核：</label>-->
                        <!--<select class="input_inputStyle" name="checkStatus" #status="ngModel" ngModel="1">-->
                            <!--<option value="1">已审核</option>-->
                            <!--<option value="0">未审核</option>-->
                            <!--<option value="-1">不通过</option>-->
                        <!--</select>-->
                    <!--</div>-->

                    <div class="input_div">
                        <div class="textarea_title">描述：</div>
                        <textarea rows="5" type="text" placeholder="描述" name="description" #description="ngModel" ngModel class="textarea_textareaStyle" placeholder="描述长度在0-50个汉字之间"
                                  minlength="0" maxlength="50"></textarea>
                        <div *ngIf="description.invalid" class="error-alert text-left">
                            <div *ngIf="description.errors.minlength || description.errors.maxlength">
                                <small class="error "> 描述长度在0-50之间</small>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer" style="width: 100%;">
                <button type="submit" class="btn btn-primary" [disabled]="addForm.invalid">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal" (click)="initService._init();_showAddChildInfo()">取消</button>
            </div>
            </form>
        </div>
    </div>
</div>